<template>
    <div>
        <div>
            <nav-bar title="注册账号" :show-back="true"/>
        </div>
        <div class="img_div">
            <img src="../img/resign2.png" style="height:2rem;width:2rem;">
        </div>
        <div class="input_div">
            <yd-cell-group>
                <yd-cell-item>
                    <span slot="left">用户名：</span>
                    <yd-input slot="right" required v-model="user" max="20" placeholder="请输入用户名"></yd-input>
                </yd-cell-item>
                <yd-cell-item>
                    <span slot="left">密码：</span>
                    <yd-input slot="right" type="password" v-model="password" placeholder="请输入密码"></yd-input>
                </yd-cell-item>
                <yd-cell-item>
                    <span slot="left">重复密码：</span>
                    <yd-input slot="right" type="password" v-model="rePassword" placeholder="请输入密码"></yd-input>
                </yd-cell-item>
            </yd-cell-group>
        </div>
        <div class="button_div">
            <yd-button @click.native="register()" size="large" bgcolor="rgb(52, 169, 214)" color="#fff">注册</yd-button>
        </div>
    </div>
</template>
<script>
import NavBar from '../components/navbar/NavBar.vue'
export default {
    name: 'RegisterSecond',
    components: {
        NavBar
    },
    data () {
        return {
            user: '',       // 用户账号
            password: '',    // 密码
            rePassword: ''  // 重复密码
        }
    },
    methods: {
        register () {
            let _this = this
            this.$dialog.toast({
                mes: '注册成功',
                timeout: 1500,
                icon: 'success',
                callback: function () {
                    _this.$router.push('/login')
                }
            })
        }
    }
}
</script>
<style scoped>
.img_div{text-align: center; margin-top: 1rem;}
.input_div{margin-top: 1rem;}
</style>
